<!-- src/components/Icon.vue -->
<template>
  <span v-html="icon" :class="['icon', `icon-${index}`]"></span>
</template>

<script setup>
import { computed, inject } from 'vue'

const props = defineProps({
  index: { type: Number, required: true }
})

// 从全局注入 iconStore
const iconStore = inject('iconStore')

// 计算当前图标
const icon = computed(() => iconStore[props.index])
</script>

<style scoped>
.icon {
  font-family: 'Your-Icon-Font'; /* 确保字体正确加载 */
  font-size: 1em;
  color: currentColor;
}
</style>